<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Flexbox Layout</title>
    <link rel="stylesheet" type="text/css" href="flexbox-layout.css">
</head>
<body>


<div class="container">

    <header>
        <nav>
            <li><img src="../../img/pro-login-logo.png" alt=""></li>
            <li><a href="#"><h1>Header</h1></a></li>
            <li><a href="#">Link</a></li>
            <li><a href="#">Link</a></li>
        </nav>
        <button>Button</button>
    </header>

    <div class="main-and-sidebar-wrapper">
        <section class="main">
            <h2>Flexbox Layout</h2>
            <p>千米电商云产品全面覆盖企业级B2B批发订货服务、B2C商城可视化搭建及管理服务、供货及分销服务,提供企业移动分销工具、O2O智能收银工具等。同时,针对不同行业特点千米网...千米电商云产品全面覆盖企业级B2B批发订货服务、B2C商城可视化搭建及管理服务、供货及分销服务,提供企业移动分销工具、O2O智能收银工具等。同时,针对不同行业特点千米网... </p>
            <img src="https://unsplash.it/500/550?image=116">
        </section>

        <aside class="sidebar">
            <h3>Sidebar</h3>
        </aside>
    </div>

    <footer>
        <h3>Footer</h3>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
    </footer>
</div>


</body>
</html>
